<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">

        <link rel="shortcut icon" href="<!--{eval echo register_static('img/touch-icon-57x57.png');}-->">

        <title>粉粉管理系统</title>

        <!-- Bootstrap core CSS -->
        <link href="<!--{eval echo register_static('css/bootstrap.min.css');}-->" rel="stylesheet">
        <link href="<!--{eval echo register_static('css/bootstrap-reset.css');}-->" rel="stylesheet">

        <!--Animation css-->
        <link href="<!--{eval echo register_static('css/animate.css');}-->" rel="stylesheet">

        <!--Icon-fonts css-->
        <link href="<!--{eval echo register_static('assets/font-awesome/css/font-awesome.css');}-->" rel="stylesheet" />
        <link href="<!--{eval echo register_static('assets/ionicon/css/ionicons.min.css');}-->" rel="stylesheet" />
        
        <link href="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.css');}-->" rel="stylesheet">
        
        <!-- Plugins css -->
        <link href="<!--{eval echo register_static('assets/modal-effect/css/component.css');}-->" rel="stylesheet">

        <!-- DataTables -->
        <link rel="stylesheet" href="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.css" rel="stylesheet');}-->" />

        <!-- Custom styles for this template -->
        <link href="<!--{eval echo register_static('css/style.css');}-->" rel="stylesheet">
        <link href="<!--{eval echo register_static('css/helper.css');}-->" rel="stylesheet">
        
        <!-- My styles for this template -->
        <link href="<!--{eval echo register_static('css/common.css');}-->" rel="stylesheet">
		<link href="<!--{eval echo register_static('assets/timepicker/bootstrap-timepicker.min.css');}-->" rel="stylesheet">
		<link href="<!--{eval echo register_static('assets/timepicker/bootstrap-datepicker.min.css');}-->" rel="stylesheet">

    </head>

    <body>

        <!-- Aside Start-->
        <!--{template admin_v2/leftside}-->
        <!-- Aside Ends-->


        <!--Main Content Start -->
        <section class="content">
            
            <!-- Header -->
            <!--{template admin_v2/header}-->
            <!-- Header Ends -->


            <!-- Page Content Start -->
            <!-- ================== -->

            <div class="wraper container-fluid diary-topics">
            
            	<div class="row">
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">机器人消息列表</h3>
                            </div>
                            <div class="panel-body">
                            	<div class="row" style="margin-bottom: 10px">
                            		<div class="col-md-11 col-sm-11 col-xs-11">
		                                <!-- Search -->
									    <div class="form-inline">
											<div style="display: inline-block; padding-right: 20px">筛选</div>
		                                    <div class="form-group">
		                                        <select class="form-control myChoose" name="group">
					                                <option value="no">组(全部)</option>
					                                <option value="0">活动</option>
					                                <option value="1">每天登录</option>
					                                <option value="2">未启动(<7)</option>
					                                <option value="3">未启动(>7)</option>
					                                <option value="4">未登录</option>
					                            </select>
		                                    </div>
											<div class="form-group">
												<select class="form-control myChoose" name="face">
													<option value="no">表情(全部)</option>
													<option value="0">欢迎</option>
													<option value="1">撒娇</option>
													<option value="2">委屈</option>
												</select>
											</div>
											<div class="form-group">
												<select class="form-control myChoose" name="action">
													<option value="no">跳转(全部)</option>
													<option value="0">无</option>
													<option value="1">社区关注</option>
													<option value="2">热门话题</option>
													<option value="3">聊天室</option>
													<option value="4">福利社</option>
													<option value="5">精选回顾</option>
													<option value="6">写日记</option>
													<option value="7">我的记录</option>
													<option value="8">每日一语</option>
													<option value="9">天气</option>
													<option value="10">手账</option>
													<option value="11">登录注册</option>
													<option value="12">同步</option>
													<option value="13">主题馆</option>
													<option value="14">信纸铺</option>
													<option value="15">表情坊</option>
													<option value="16">精选列表</option>
													<option value="17">新鲜列表</option>
													<option value="18">粉币乐园</option>
													<option value="19">自定义跳转</option>
												</select>
											</div>
											<div class="form-group">
												<select class="form-control myChoose" name="status">
													<option value="no">状态(全部)</option>
													<option value="0">使用中</option>
													<option value="1">已禁用</option>
												</select>
											</div>
											<div class="form-group">
												<select class="form-control myChoose" name="platform">
													<option value="no">平台(全部)</option>
													<option value="0">通用</option>
													<option value="1">IOS</option>
													<option value="2">安卓</option>
												</select>
											</div>
											<div class="form-group pageCon">

											</div>
		                                </div>
		                            </div>
                                	<div class="col-md-1 col-sm-1 col-xs-1">
										<button class="btn btn-info myAdd"><i class="ion-plus-round"></i> 新增</button>
		                            </div>
                            	</div>
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 col-xs-12">
                                        <table id="datatable" class="table table-striped table-bordered table-hover">
                                            <thead>
                                                <tr>
                                                    <th>序号</th>
				                                    <th>组</th>
				                                    <th>内容</th>
													<th>显示时间</th>
				                                    <th>表情</th>
				                                    <th>跳转</th>
				                                    <th>平台</th>
				                                    <th>排序</th>
				                                    <th>操作</th>
                                                </tr>
                                            </thead>

                                            <tbody id="tbody">

                                             </tbody>
                                         </table>
                                     </div>
								</div>
								<div class="row" style="margin-top: 15px">
									<div class="form-group pageCon"></div>
								</div>
                             </div>
                         </div>
                     </div>
                 </div>

            </div>
            <!-- Page Content Ends -->
            <!-- ================== -->
            
            <div id="con-close-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
      
  			</div><!-- /.modal -->
            

            <!-- Footer Start -->
            <!--{template admin_v2/footer}-->
            <!-- Footer Ends -->



        </section>
        <!-- Main Content Ends -->

		<!--template start-->
		<script type="text/template" id="tableCon">
			{{#.}}
			<tr>
				<td>{{{id}}}</td>
				<td><button class="btn btn-success btn-xs">{{{robotGroupNO2Text group}}}</button></td>
				<td>{{{content}}}</td>
				<td>{{{start}}} - {{{end}}}</td>
				<td><label class="label label-success">{{{robotFaceNO2Text face}}}</label></td>
				<td><label class="label label-primary">{{{robotActionNO2Text action}}}</label></td>
				<td>{{{robotMsgPlatformIcon platform}}}</td>
				<td>{{{sort}}}</td>
				<td>
					<div class="btn-group btn-group-sm">
						{{{robotMsgStatusOpBtn status id}}}
						<button type="button" class="btn btn-info myEdit" data-id="{{{id}}}">编辑</button>
					</div>
				</td>
			</tr>
			{{/.}}
		</script>

		<script type="text/template" id="editModal">
			{{#.}}
			<form>
				<div>
					<table class="table table-bordered">
						<thead>
						<tr>
							<th width="25%">类别</th>
							<th width="75%">内容</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td>所属组</td>
							<td>
								<select style="height: 26px;" name="group">
									{{{robotGroupSelect group}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>适用平台</td>
							<td>
								<select style="height: 26px;" name="platform">
									{{{robotMsgPlatformSelect platform}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>内容</td>
							<td>
								<textarea class="form-control" rows="3" name="content">{{{content}}}</textarea>
							</td>
						</tr>
						<tr>
							<td>显示时间</td>
							<td>
								<div class="form-inline">
									<div class="form-group bootstrap-timepicker">
										<label>开始:</label>
										<input type="time" name="start" class="form-control timepicker2" placeholder="" value="{{{start}}}" style="width: 80px">
									</div>
									<div class="form-group bootstrap-timepicker">
										<label>结束:</label>
										<input type="time" name="end" class="form-control timepicker2" placeholder="" value="{{{end}}}" style="width: 80px">
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>表情</td>
							<td>
								<select style="height: 26px;" name="face">
									{{{robotFaceSelect face}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>跳转</td>
							<td>
								<select style="height: 26px;" name="action" class="actionChange">
									{{{robotActionSelect action}}}
								</select>
							</td>
						</tr>
						<tr class="diyAction">
							<td>自定义action</td>
							<td>
								<input type="text" name="diyaction" class="form-control" placeholder="" value="{{{diyaction}}}">
							</td>
						</tr>
						<tr>
							<td>排序</td>
							<td>
								<input type="number" name="sort" class="form-control" placeholder="" value="{{{sort}}}" style="width: 100px" min="0">
							</td>
						</tr>
						<tr>
							<td>操作</td>
							<td style="text-align: center">
								<button type="button" class="btn btn-danger myDelete" data-id="{{{id}}}">删除</button>&nbsp;&nbsp;&nbsp;&nbsp;
								<button type="button" class="btn btn-info myEditPost" data-id="{{{id}}}">完成</button>
							</td>
						</tr>
						</tbody>
					</table>
				</div>
			</form>
			{{/.}}
		</script>

		<script type="text/template" id="addModal">
			<form>
				<div>
					<table class="table table-bordered">
						<thead>
						<tr>
							<th width="25%">类别</th>
							<th width="75%">内容</th>
						</tr>
						</thead>
						<tbody>
						<tr>
							<td>所属组</td>
							<td>
								<select style="height: 26px;" name="group">
									{{{robotGroupSelect 0}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>适用平台</td>
							<td>
								<select style="height: 26px;" name="platform">
									{{{robotMsgPlatformSelect 0}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>内容</td>
							<td>
								<textarea class="form-control" rows="3" name="content"></textarea>
							</td>
						</tr>
						<tr>
							<td>显示时间</td>
							<td>
								<div class="form-inline">
									<div class="form-group bootstrap-timepicker">
										<label>开始:</label>
										<input type="time" name="start" class="form-control timepicker2" placeholder="" value="" style="width: 80px">
									</div>
									<div class="form-group bootstrap-timepicker">
										<label>结束:</label>
										<input type="time" name="end" class="form-control timepicker2" placeholder="" value="" style="width: 80px">
									</div>
								</div>
							</td>
						</tr>
						<tr>
							<td>表情</td>
							<td>
								<select style="height: 26px;" name="face">
									{{{robotFaceSelect 0}}}
								</select>
							</td>
						</tr>
						<tr>
							<td>跳转</td>
							<td>
								<select style="height: 26px;" name="action" class="actionChange">
									{{{robotActionSelect 0}}}
								</select>
							</td>
						</tr>
						<tr class="diyAction" style="display: none">
							<td>自定义action</td>
							<td>
								<input type="text" name="diyaction" class="form-control" placeholder="" value="">
							</td>
						</tr>
						<tr>
							<td>排序</td>
							<td>
								<input type="number" name="sort" class="form-control" placeholder="" value="0" style="width: 100px" min="0">
							</td>
						</tr>
						<tr>
							<td>操作</td>
							<td style="text-align: center">
								<button type="button" class="btn btn-info myAddPost" data-id="{{{id}}}">确定添加</button>
							</td>
						</tr>
						</tbody>
					</table>
				</div>
			</form>
		</script>
		<!--template end-->


        <!-- js placed at the end of the document so the pages load faster -->
        <script src="<!--{eval echo register_static('js/jquery.js');}-->"></script>
        <script src="<!--{eval echo register_static('js/bootstrap.min.js');}-->"></script>
        <script src="<!--{eval echo register_static('js/pace.min.js');}-->"></script>
        <script src="<!--{eval echo register_static('js/wow.min.js');}-->"></script>
        <script src="<!--{eval echo register_static('js/jquery.nicescroll.js');}-->" type="text/javascript"></script>
		<script src="<!--{eval echo register_static('js/jquery.app.js');}-->"></script>

		<script src="<!--{eval echo register_static('js/handlebars-v4.0.5.js');}-->"></script>
		<script src="<!--{eval echo register_static('js/handlebars-helper.js');}-->"></script>
		<script src="<!--{eval echo register_static('layer/layer.js');}-->"></script>
		<script src="<!--{eval echo register_static('laypage/laypage.js');}-->"></script>
		<script src="<!--{eval echo register_static('assets/timepicker/bootstrap-timepicker.min.js');}-->"></script>
		<script src="<!--{eval echo register_static('assets/timepicker/bootstrap-datepicker.js');}-->"></script>

        <script src="<!--{eval echo register_static('assets/datatables/jquery.dataTables.min.js');}-->"></script>
        <script src="<!--{eval echo register_static('assets/datatables/dataTables.bootstrap.js');}-->"></script>
        <script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.min.js');}-->"></script>
        <script src="<!--{eval echo register_static('assets/sweet-alert/sweet-alert.init.js');}-->"></script>
        
        <!-- Modal-Effect -->
        <script src="<!--{eval echo register_static('assets/modal-effect/js/classie.js');}-->"></script>
        <script src="<!--{eval echo register_static('assets/modal-effect/js/modalEffects.js');}-->"></script>
        
		<script type="text/javascript">
            $(document).ready(function() {

				//编译模板
				var tp_tableCon = Handlebars.compile($('#tableCon').html());
				var tp_editModal = Handlebars.compile($('#editModal').html());
				var tp_addModal = Handlebars.compile($('#addModal').html());

				$('.myChoose').change(function () {
					_Where_.page = 1;
					var name = $(this).attr('name');
					switch (name){
						case 'group':
							$(this).val() != 'no' ?  _Where_.group = $(this).val() : _Where_.group = undefined;
							break;
						case 'face':
							$(this).val() != 'no' ?  _Where_.face = $(this).val() : _Where_.face = undefined;
							break;
						case 'action':
							$(this).val() != 'no' ?  _Where_.action = $(this).val() : _Where_.action = undefined;
							break;
						case 'status':
							$(this).val() != 'no' ?  _Where_.status = $(this).val() : _Where_.status = undefined;
							break;
						case 'platform':
							$(this).val() != 'no' ?  _Where_.platform = $(this).val() : _Where_.platform = undefined;
							break;
					}
					RequestList();
				});

				$('.myAdd').click(function () {
					var html = tp_addModal();
					layer.open({
						type: 1,
						title: '新增',
						closeBtn: 1,
						area:['40%'],
						shadeClose: true,
						content: html
					});
				});

				$(document).off('click', '.myDelete').on('click', '.myDelete', function () {
					var id = $(this).data('id');

					layer.confirm('确定删除？', {icon: 3, title:'提示'}, function(i){
						var index = layer.load();
						$.post(
								'/admin.php?ac=robot&op=delete&id=' + id,
								function (r) {
									layer.close(index);
									if(r._code == 1){
										layer.closeAll();
										RequestList();
										layer.msg('已删除', {icon: 1});
									}else{
										layer.msg(r._msg, {icon: 0});
									}
								}
						);
					});
				});

				$(document).off('click', '.myAddPost').on('click', '.myAddPost', function () {
					var index = layer.load();
					var param = $(this).parents('form').serialize();
					$.post(
							'/admin.php?ac=robot&op=add',
							param,
							function (r) {
								layer.close(index);
								if(r._code == 1){
									layer.closeAll();
									RequestList();
//									layer.msg('添加成功', {icon: 1});
								}else{
									layer.msg(r._msg, {icon: 0});
								}
							}
					);

				});

				$(document).off('click', '.myStatus').on('click', '.myStatus', function () {
					var id = $(this).data('id');
					var status = $(this).data('status');
					status = status == 1 ? 0 : 1;
					layer.load();
					var param = {status:status};
					$.post(
							'/admin.php?ac=robot&op=editdetail&id=' + id,
							param,
							function (r) {
								layer.closeAll();
								if(r._code == 1){
									RequestList();
//									layer.msg('更新成功', {icon: 1});
								}else{
									layer.msg(r._msg, {icon: 0});
								}
							}
					);

				});

				$(document).off('click', '.myEditPost').on('click', '.myEditPost', function () {
					var id = $(this).data('id');
					layer.load();
					var param = $(this).parents('form').serialize();
					$.post(
							'/admin.php?ac=robot&op=editdetail&id=' + id,
							param,
							function (r) {
								layer.closeAll();
								if(r._code == 1){
									RequestList();
									layer.msg('更新成功', {icon: 1});
								}else{
									layer.msg(r._msg, {icon: 0});
								}
							}
					);

				});

				$(document).off('click', '.myEdit').on('click', '.myEdit', function () {
					var id = $(this).data('id');
					var index = layer.load();
					$.post(
							'/admin.php?ac=robot&op=msgdetail',
							{id:id},
							function (r) {
								layer.close(index);
								if(r._code == 1){
									var json_param = JSON.parse(r.result.json_param);
									r.result.diyaction = r.result.action == 19 ? json_param.action : undefined;
									var html = tp_editModal(r.result);
									layer.open({
										type: 1,
										title: '编辑消息',
										closeBtn: 1,
										area:['40%'],
										shadeClose: true,
										content: html
									});
									ActionChangeSelect(r.result.action);
								}else{
									layer.msg(r._msg, {icon: 0});
								}
							}
					);

				});

				$(document).off('mouseenter', '.timepicker2').on('mouseenter', '.timepicker2', function () {
					$('.timepicker2').timepicker({showMeridian: false,defaultTime:''});
				});

				$(document).off('change', '.actionChange').on('change', '.actionChange', function () {
					var NO = $(this).val();
					ActionChangeSelect(NO);
				});
				
				var ActionChangeSelect = function (NO) {
					NO == 19 ? $('.diyAction').show() : $('.diyAction').hide();
				}

				_Where_ = {page:1};
				//请求数据列表数据
				var RequestList = function () {
					where = _Where_;
					if(typeof where == 'undefined')where = {};
					var index = layer.load();
					$.post(
							'/admin.php?ac=robot&op=list',
							where,
							function (r) {
								if (r._code == 1){
									var html = tp_tableCon(r.result);
									$('#tbody').html(html);
									laypage({
										cont: $('.pageCon'), //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>
										pages: 10, //通过后台拿到的总页数
										curr: _Where_.page || 1, //当前页
										jump: function(obj, first){ //触发分页后的回调
											if(!first){ //点击跳页触发函数自身，并传递当前页：obj.curr
												_Where_.page = obj.curr;
												RequestList();
											}
										}
									});
								}else{
									layer.msg(r._msg, {icon: 0});
								}
								layer.close(index);
							}
					);
				}
				RequestList();

            } );
        </script>
    </body>
</html>
